<template>
  <div class="home">
    <div class="item" v-for="item in tabs" :key="item.id" @click="changeTab(item.id)">
      <img :src="item.icon" />
    </div>
  </div>
</template>

<script>

export default {
  name: 'Tab',
  data () {
    return {
      tabs: [
        {
          id: 1,
          icon: require('@/assets/images/tabbar/img-shop.png'),
          name: '超市',
          status: 0
        },
        /* {
          id: 2,
          icon: require('@/assets/images/tabbar/img-wallet.png'),
          name: '余额',
          status: 0
        },
        {
          id: 7,
          bgColor: '',
          icon: require('@/assets/images/icon-ozb.png'),
          name: '',
          status: 0
        },
        {
          id: 6,
          icon: require('@/assets/images/tabbar/img-sigin.png'),
          name: '签到',
          status: 0
        },
        {
          id: 3,
          icon: require('@/assets/images/tabbar/img-checkout.png'),
          name: '结账',
          status: 0
        }, */
        {
          id: 4,
          icon: require('@/assets/images/tabbar/img-call.png'),
          name: '呼叫',
          status: 0
        },
      ]
    }
  },
  methods: {
    changeTab (type) {
      switch (type) {
        case 1:
          window.ipc.send('change-tab', 1)
          break
        case 2:
          window.ipc.send('change-tab', 3)
          break
        case 3:
          window.ipc.send('window-check-show')
          break
        case 4:
          var timestamp = new Date().getTime()
          let oldTime = sessionStorage.oldTime
          if (oldTime) {
            let times = Math.abs(timestamp - oldTime) >= (0.5 * 60 * 1000)
            if (!times) {
              return
            }
          }
          this.tabs.find(item => item.id == type).status = 1
          this.tabs.find(item => item.id == type).name = '已呼叫'
          setTimeout(() => {
            this.tabs.find(item => item.id == type).status = 0
            this.tabs.find(item => item.id == type).name = '呼叫'
          }, 1000)
          window.ipc.send('call-network')
          sessionStorage.oldTime = new Date().getTime()
          break
        // case 5:
        //   window.ipc.send('window-comment', window.location.protocol + '//' + window.location.host + '/#/comment')
        //   break
        case 6:
          window.ipc.send('change-tab', 4)
          break
        case 7:
          window.ipc.send('change-tab', 6)
          break
        default:
          break
      }
    },
  },
  created () {
    let query = this.$route.query
    if (query.secret) {
      this.$store.dispatch('load',query.secret)
    }
  },
}
</script>
<style lang="scss" scoped>
.home {
  height: 100%;
  display: flex;
  flex-direction: column;
  background-color: rgba(0, 0, 0, 0.2);
  border-radius: 6px;
  padding: 10px;
  justify-content: space-around;

  .item {
    width: 50px;
    height: 50px;
    transition: all 0.1s ease-in-out;
    cursor: pointer;
    img {
      width: 100%;
      height: 100%;
    }
    &:hover {
      transform: scale(1.1);
    }
  }
}
</style>
